<template>
     <div class="home">
          <v-loay loays="名称">
              <span v-for="(item,index) in txt" :key="index" :class="['spans',index == form.ind?'active':'']" @click="spansTab(index)" >{{item}}</span>
         </v-loay>
         <v-loay loays="公司名称">
             <v-input v-model="form.name" place="公司名称"></v-input>
         </v-loay>
         <v-loay loays="纳税人" v-if="form.ind !== 2">
             <v-input v-model="form.taxp" place="纳税人"></v-input>
         </v-loay>
         <v-loay loays="邮箱">
             <v-input v-model="form.emil" place="邮箱"></v-input>
         </v-loay>
          <v-loay loays="是否纳税" v-if="form.ind !== 2">
              <v-swidth v-model="form.istaxp" clis="istaxp"></v-swidth>
          </v-loay>
          <v-loay loays="是否开启">
              <v-swidth v-model="form.isemil" clis="isemil" ></v-swidth>
          </v-loay>
          <button @click="isedil">新增</button>
     </div>
</template>

<script>
import vInput from '../components/v-input.vue'
import vSwidth from '@/components/v-swidth'
import vLoay from '@/components/v-loay'
export default {
    data(){
        return {
            form:{
                name:"",
                emil:"",
                taxp:"",
                istaxp:false,
                isemil:false,
                ind:0,
            },
            txt:["公司","公司名称","个人"]    
        }
    },
  components: { vInput,vSwidth,vLoay},
  methods:{
      changeall(e){
          this.name=e.target.value
      },
      spansTab(ind){
        this.form.ind=ind
      },
      isedil(){
         this.$router.push('/isedil') 
      }
  },

  
}
</script>

<style scoped>
 .spans{
     margin: 0 15px;
     padding: 0 10px;
     height: 30px;
     line-height: 30px;
     border: 1px solid #ccc;
     text-align: center;
     border-radius: 15px;
     display: inline-block;
     
 }
 .active{
     border: 1px solid red;
 }
</style>